<template>
  <div class="openDetail">
    <hr style="border: none">
    <hr>
    <div>
      姓名: {{tableData.name}}
      <el-form :model="tableData" ref="dataForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label="登陆名" prop="loginName">
          <el-input v-model="tableData.loginName"></el-input>
        </el-form-item>
        <el-form-item label="学号" prop="no">
          <el-input v-model="tableData.no"></el-input>
        </el-form-item>
        <el-form-item label="邮箱" prop="email">
          <el-input v-model="tableData.email"></el-input>
        </el-form-item>
        <el-form-item label="手机号码" prop="phone">
          <el-input v-model="tableData.phone"></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <el-input v-model="tableData.sex"></el-input>
        </el-form-item>
        <el-form-item label="学院" prop="college">
          <el-input v-model="tableData.college"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="dataFormSubmit()">提交</el-button>
          <el-button @click="resetForm('dataForm')">重置</el-button>
<!--          <el-button type="primary" @click="submitForm('tableData')">提交</el-button>-->
<!--          <el-button @click="resetForm('ruleForm')">重置</el-button>-->
        </el-form-item>
      </el-form>
    </div>

  </div>
</template>

<script>
  export default {
    name: 'user-update',
    data () {
      return {
        loading: false,
        url: {
          queryPage: '/Yang/User/findById',
          update: '/Yang/User/update'
        },
        tableData: {
          id: '',
          loginName: '',
          no: '',
          name: '',
          email: '',
          phone: '',
          sex: '',
          college: ''
        },
        dataForm: {
          id: '',
          loginName: '',
          no: '',
          email: '',
          phone: '',
          sex: '',
          college: ''
        },
        queryForm: {
          dialogFormVisible: false,
          data: {
            currentPage: 1,
            pageSize: 10,
            name: ''
          }
        }
      }
    },
    methods: {
      // 加载列表页
      queryFormSubmit: function (id) {
        this.loading = true
        this.$http
          .get(this.$http.adornUrl(this.url.queryPage), {
            params: this.$http.adornParams({id: id})
          })
          .then(({data}) => {
            this.loading = false
            this.tableData = data
            this.tableData.loginName = data.loginName
            this.tableData.no = data.no
            this.tableData.name = data.name
            this.tableData.email = data.email
            this.tableData.phone = data.phone
            this.tableData.sex = data.sex
            this.tableData.college = data.college
            console.log(this.tableData, 'tableData')
          })
      },
      // 提交表单
      dataFormSubmit () {
        this.loading = true
        this.$http({
          url: this.$http.adornUrl('/Yang/User/update'),
          method: 'post',
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8'
          },

          data: this.$http.adornData(
            {
              id: this.tableData.id || undefined,
              loginName: this.tableData.loginName,
              no: this.tableData.no,
              email: this.tableData.email,
              phone: this.tableData.phone,
              sex: this.tableData.sex,
              college: this.tableData.college
            },
                false,
                'form'
              )
        })
              .then(() => {
                this.loading = false
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500  // 持续时间

                })
                this.$router.push({name: 'user-user'})
              })
        this.getUserInfo()
      },
      getUserInfo () {
        this.$http({
          url: 'myinfo',
          method: 'get'
        }).then(({data}) => {
          console.log('myinfo555', data)
          this.userData = data
          this.loading = false

          this.userId = data.id
          this.userName = data.name
          this.loginName = data.loginName
          this.email = data.email
          this.photo = data.photo
          this.phone = data.phone
        })
      }
    },
    created: function () {
      let id = this.$route.params.id || 0
      console.log('id', id)
      this.queryFormSubmit(id)
    },
    // 表单重置
    resetForm (formName) {
      console.log('111111111111111111111')
      this.$refs[formName].resetFields()
    }
  }
</script>

<style scoped>
</style>
